<style type="text/css">
    .contacts-box{padding: 20px;}
    .headimg{height: 35px;width: 35px;}
</style>
<script>
    var baseUrl = "<?php echo $baseUrl; ?>?t=1";
</script>

<div class="layui-row search-row" id="search-box">
    <div class="item">
        <div class="row">
            <div class="box">
                <span class="title">有无反馈：</span>
                <div data-key="feedback" data-type="list" class="search-key list" >
                    <ul>
                        <li><span data-value="1">有</span></li>
                        <li><span data-value="2">无</span></li>
                    </ul>
                </div>
            </div>
        </div>
    </div>
    <div class="item">
        <div class="row" style="width: 360px;">
            <div class="box">
                <span class="title">关键字查询：</span>
                <div data-key="key" data-type="txt" class="search-key txt">
                    <input type="text" value="" placeholder="姓名/手机号/身份证/微信昵称"/>
                </div>
            </div>
        </div>
        <div class="row" style="width: 460px;">
            <div class="btn">
                <button class="layui-btn layui-btn-sm btn-query">查询</button>
            </div>
        </div>
    </div>
</div>
<table data-url="<?php echo $baseUrl; ?>?action=list"
       data-search="#search-box"
       data-page=""
       data-height="full-230"
       id="data-list"
       lay-filter='data-list' style="display: none;">
    <thead>
    <tr>
        <th width="110" align="center" field="idnum">编号</th>
        <th width="110" field="name">姓名</th>
        <th width="130" field="telephone">手机</th>
        <th width="200" field="id_card">身份证</th>
        <th width="110" align="center" templet="#tpl-idimgp">身份证正面</th>
        <th width="110" align="center" templet="#tpl-idimgb">身份证反面</th>
        <th width="110" field="nickname">微信昵称</th>
        <th width="110" align="center" templet="#tpl-headimg">微信头像</th>
        <th width="110" align="center" templet="#tpl-sex">性别</th>
        <th width="110" align="center" field="feedback">反馈意见</th>
        <th minWidth="180" toolbar="#tpl-cmd">操作</th>
    </tr>
    </thead>
</table>

<script type="text/html" id="tpl-headimg">
    {{# if(d.head_img!=''){ }}
    <img class="headimg" src="{{d.head_img}}">
    {{# } }}
</script>
<script type="text/html" id="tpl-sex">
    {{# if(d.sex==0){ }}
    未知
    {{# }else if(d.sex==1){ }}
    男
    {{# }else{ }}
    女
    {{# } }}
</script>

<script type="text/html" id="tpl-idimgp">
    {{# if(d.id_img_p!=''){ }}
    <img src="{{d.id_img_p}}">
    {{# } }}
</script>

<script type="text/html" id="tpl-idimgb">
    {{# if(d.id_img_b!=''){ }}
    <img src="{{d.id_img_b}}">
    {{# } }}
</script>

<script type="text/html" id="tpl-cmd">
    <?php if(Cm::$app->limitPost('/platform/user/index','contacts')){ ?>
        <button onclick="app.contacts({{d.id}})" class="layui-btn layui-btn-xs">常用联系人</button>
    <?php } ?>    
    <?php if(Cm::$app->limitPost('/platform/user/index','feedback')){ ?>
        <button onclick="app.feedback({{d.id}})" class="layui-btn layui-btn-xs">反馈意见</button>
    <?php } ?>    
    <span style="display: none;">{{JSON.stringify(d)}}</span>
</script>
<!-- <?php if(Cm::$app->limitPost('/platform/user/index','del')){ ?>
        <button onclick="app.del({{d.id}})" class="layui-btn layui-btn-danger layui-btn-xs">删除</button>
    <?php } ?>  -->
<script type="text/html" id="tpl-contacts">
    <div class="contacts-box">
        <table lay-filter="parse-table-contacts">
          <thead>
            <tr>
              <th lay-data="{field:'name', align:'center', width:150}">姓名</th>
              <th lay-data="{field:'telephone', align:'center', width:150}">联系方式</th>
              <th lay-data="{field:'id_card', align:'center', minWidth: 180}">身份证</th>
            </tr> 
          </thead>
          <tbody>
            {{each item as value}}
            <tr>
              <td>{{value.name}}</td>
              <td>{{value.telephone}}</td>
              <td>{{value.id_card}}</td>
            </tr>
            {{/each}}
          </tbody>
        </table>    
    </div>
</script>
<script type="text/html" id="tpl-feedback">
    <div class="contacts-box">
        <table lay-filter="parse-table-feedback">
          <thead>
            <tr>
              <th lay-data="{field:'ids', align:'center', width:150}">序号</th>
              <th lay-data="{field:'content', align:'center', width:150}">反馈内容</th>
              <th lay-data="{field:'addtime', align:'center', minWidth: 180}">反馈时间</th>
            </tr> 
          </thead>
          <tbody>
            {{each item as value}}
            <tr>
              <td>{{value.ids}}</td>
              <td>{{value.content}}</td>
              <td>{{value.addtime}}</td>
            </tr>
            {{/each}}
          </tbody>
        </table>    
    </div>
</script>

<script>
    var app = {
        init: function () {
            $('#data-list').table();
            this.form.init();
            this.table.init();
        },
        form: {
            obj: null,
            init: function () {
                var _this = this;
                layui.use('form', function () {
                    var form = layui.form;
                    _this.obj = form;
                });
            },
            on: function () {
                var _this = this;

            },
            render: function (select) {
                this.obj.render(select);
                this.on();
            }
        },
        del:function (id) {
            layer.msg("确定删除该会员吗？", {
                time: false, //20s后自动关闭
                btn: ['确定', '取消'],
                yes:function () {
                    $.post(baseUrl+'&action=del',{id:id},function (d) {
                        layer.closeAll();
                        if(d.flag)
                        {
                            layer.msg('删除成功');
                            $('#data-list').table();
                        }else{
                            layer.msg(d.msg);
                        }
                    },'json')
                }
            });
        },
        contacts:function(id){
            $.post(baseUrl+'&action=contacts',{id:id},function (d) {
                if(d.flag)
                {
                    layer.open({
                        title:false,
                        area:['530px','550px'],
                        type:1,
                        content:template('tpl-contacts', {item:d.data})
                    });
                    
                    app.table.obj.init('parse-table-contacts', { });
                }else{
                    layer.msg(d.msg);
                }
            },'json')
        },
        table:{
            obj:null,
            init:function(){
                var _this = this;
                layui.use('table', function(){
                    _this.obj = layui.table;
                });
            }
        },
        feedback:function(id){
            $.post(baseUrl+'&action=feedback',{id:id},function (d) {
                if(d.flag)
                {
                    layer.open({
                        title:false,
                        area:['530px','550px'],
                        type:1,
                        content:template('tpl-feedback', {item:d.data})
                    });
                    
                    app.table.obj.init('parse-table-feedback', { });
                }else{
                    layer.msg(d.msg);
                }
            },'json')
        }
    };

    app.init();
</script>